<template>
    <el-carousel :interval="4000" type="card" height="200px">
      <el-carousel-item v-for="item in tableData" :key="item">
            <img :src="getImageUrl(item.GoodsImages)" alt="">
      </el-carousel-item>
    </el-carousel>
  </template>

  
  <script setup lang="ts">
  import axios from 'axios';
  import moment from 'moment';
 import {ref,reactive,onMounted}from 'vue'


 let tableData:any=ref([])

//获取列表
const Listss=()=>{
    console.log("tableData=",tableData);
    
  axios.get('/api/Goods/GetGoodsListPagedAsunc')
  .then(res=>{
      console.log(res);

      tableData.value=res.data.data.data

  })
}

onMounted(()=>{
    Listss()
})

const apiUrl = import.meta.env.VITE_APP_API_URL;
function getImageUrl(path) {
  if (!path) return '';
  if (path.startsWith('http')) return path;
  if (path.startsWith('/img/')) return apiUrl + path;
  if (path.startsWith('img/')) return apiUrl + '/' + path;
  return apiUrl + '/img/' + path.replace(/^\\/, '');
}
  
  </script>



  
  <style scoped>
  .el-carousel__item h3 {
    color: #475669;
    opacity: 0.75;
    line-height: 200px;
    margin: 0;
    text-align: center;
  }
  
  .el-carousel__item:nth-child(2n) {
    background-color: #99a9bf;
  }
  
  .el-carousel__item:nth-child(2n + 1) {
    background-color: #d3dce6;
  }
  </style>
  